<template>
	<view>
		<cu-custom :bgColor="'bg-' + theme.backgroundColor" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">钱包</block>
		</cu-custom>
		<view>
			<view class="recharge bg-white p-all30 m-all20 border-r flex">
				<text class="f32">充值金额:</text>
				<input type="decimal" v-model="price" placeholder="请输入充值金额" />
			</view>
			<button class="recharge-btn m-all20 border-r" :disabled="payLoadling" @tap.stop="recharge">
				提交
			</button>
			<!-- <view class="qb-ye text-center p-all50 bg-white m-all20 border-r">
				<view class="f70 text-price text-red">{{ 10000 }}</view>
				<view class="f40 mt30">当前余额 </view>
			</view>
			<view class="tools bg-white border-r m-all20 p-all20">
				<view
					class="item text-center"
					v-for="(item, index) in tools"
					:key="index"
					@tap.stop="$goUrl(item.url)">
					<view class="f60 mb10 text-red"  :class="item.icon"></view>
					<view class="f36">{{ item.label }}</view>
				</view>
			</view> -->
		</view>
	</view>
</template>
<script>
const app = getApp();
import util from "utils/util";
import api from "utils/api";
export default {
	data() {
		return {
			theme: app.globalData.theme,
			price: 0,
			payLoadling: false,
		};
	},
	methods: {
		recharge() {
			this.payLoadling = true;
			// 充值逻辑
			//大于0 最多两位小数
			let reg = /^\d?\d.?\d{0,2}$/;
			if (this.price <= 0) {
				uni.showToast({
					title: "请输入大于0的金额",
					icon: "none",
				});
				this.payLoadling = false;
				return;
			}
			if (!reg.test(this.price)) {
				uni.showToast({
					title: "请输入最多两位小数的金额",
					icon: "none",
				});
				this.payLoadling = false;
				return;
			}

			let para = { paymentPrice: this.price };
			let that = this
			api
				.subLiveWxPay(para)
				.then((res) => {
					let payData = res.data;
					uni.requestPayment({
						provider: "wxpay",
						timeStamp: payData.timeStamp,
						nonceStr: payData.nonceStr,
						package: payData.packageValue,
						signType: payData.signType,
						paySign: payData.paySign,
						success: function (res) {
							// 支付成功跳转到支付结果页面
							uni.showModal({
								title: "提示",
								content: "充值成功",
								showCancel: true,
								confirmText: "查看余额",
								cancelText: "继续充值",
								success: ({ confirm, cancel }) => {
									if (confirm) {
										uni.redirectTo({
											url: "/pages/purse/index",
										});
									}
								},
							
							});
						},
						fail: function (res) {
							console.log('充值取消');
							console.log("fail:" + JSON.stringify(res));
						},
						complete: function (res) {
							that.payLoadling = false;
							console.log(res);
						},
					});
				})
				.catch((err) => {
					this.payLoadling = false;
				});
		},
	},
};
</script>
<style lang="scss" scoped>
.tools {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	.item {
		width: 25%;
	}
}
.recharge {
	height: 160rpx;
	display: flex;
	align-items: center;
	input {
		width: 100%;
		height: 100%;
		border: none;
		outline: none;
		flex: 1;
		margin-left: 20rpx;
		font-size: 32rpx;
	}
}
.recharge-btn {
	background-color: #ff0000;
	color: #fff;
	text-align: center;
	font-size: 32rpx;
}
</style>
